<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="StyleSheet" href="../css/jpetstore.css" type="text/css" media="screen"/>
    <title>Title</title>
</head>
<body>
<div>
<header th:replace="common/top">
</header>


<div id="Content">
    <ul class="messages">
        <li>${sessionScope.message}</li>
    </ul>

    <div id="BackLink">
        <a href="/catalog/index">Return to Main Menu</a>
    </div>

    <div id="Catalog">

        <table>
            <tr>
                <th align="center" colspan="2">
<!--                    Order #${sessionScope.order.orderId}-->
<!--                    <fmt:formatDate value="${sessionScope.order.orderDate}" pattern="yyyy/MM/dd hh:mm:ss" />-->
                <p th:text="${order.orderId}"></p>
                    <p th:text="${#dates.format(order.orderDate,'yyyy-MM-dd/HH:mm:ss')}"></p>

                </th>
            </tr>
            <tr>
                <th colspan="2">Payment Details</th>
            </tr>
            <tr>
                <td>Card Type:</td>
                <td th:text="${order.cardType}">
<!--                    <c:out value="${sessionScope.order.cardType}" />-->
                </td>
            </tr>
            <tr>
                <td>Card Number:</td>
                <td th:text="${order.creditCard}">
<!--                    <c:out value="${sessionScope.order.creditCard}" />* Fake number!-->
                </td>
            </tr>
            <tr>
                <td>Expiry Date (MM/YYYY):</td>
                <td th:text="${#dates.format(order.orderDate,'yyyy-MM-dd HH:mm:ss')}">
<!--                    <c:out value="${sessionScope.order.expiryDate}" />-->
                </td>
            </tr>
            <tr>
                <th colspan="2">Billing Address</th>
            </tr>
            <tr>
                <td>First name:</td>
                <td th:text="${order.billToFirstName}">
<!--                    <c:out value="${sessionScope.order.billToFirstName}" />-->
                </td>
            </tr>
            <tr>
                <td>Last name:</td>
                <td th:text="${order.billToLastName}">
<!--                    <c:out value="${sessionScope.order.billToLastName}" />-->
                </td>
            </tr>
            <tr>
                <td>Address 1:</td>
                <td th:text="${order.billAddress1}">
<!--                    <c:out value="${sessionScope.order.billAddress1}" />-->
                    </td>
            </tr>
            <tr>
                <td>Address 2:</td>
                <td th:text="${order.billAddress2}">
<!--                    <c:out value="${sessionScope.order.billAddress2}" />-->
                </td>
            </tr>
            <tr>
                <td>City:</td>
                <td th:text="${order.billCity}">
<!--                    <c:out value="${sessionScope.order.billCity}" />-->
                </td>
            </tr>
            <tr>
                <td>State:</td>
                <td th:text="${order.billState}">

                </td>
            </tr>
            <tr>
                <td>Zip:</td>
                <td th:text="${order.billZip}">
<!--                    <c:out value="${sessionScope.order.billZip}" />-->
                </td>
            </tr>
            <tr>
                <td>Country:</td>
                <td th:text="${order.billCountry}">
<!--                    <c:out value="${sessionScope.order.billCountry}" />-->
                </td>
            </tr>
            <tr>
                <th colspan="2">Shipping Address</th>
            </tr>
            <tr>
                <td>First name:</td>
                <td th:text="${order.shipToFirstName}">
<!--                    <c:out value="${sessionScope.order.shipToFirstName}" />-->
                </td>
            </tr>
            <tr>
                <td>Last name:</td>
                <td th:text="${order.shipToLastName}">
<!--                    <c:out value="${sessionScope.order.shipToLastName}" />-->
                </td>
            </tr>
            <tr>
                <td th:text="${order.shipAddress1}">Address 1:</td>
                <td>
<!--                    <c:out value="${sessionScope.order.shipAddress1}" />-->
                </td>
            </tr>
            <tr>
                <td>Address 2:</td>
                <td th:text="${order.shipAddress2}">
<!--                    <c:out value="${sessionScope.order.shipAddress2}" />-->
                </td>
            </tr>
            <tr>
                <td>City:</td>
                <td th:text="${order.shipCity}">
<!--                    <c:out value="${sessionScope.order.shipCity}" />-->
                </td>
            </tr>
            <tr>
                <td>State:</td>
                <td th:text="${order.shipState}">
<!--                    <c:out value="${sessionScope.order.shipState}" />-->
                </td>
            </tr>
            <tr>
                <td>Zip:</td>
                <td th:text="${order.shipZip}">

                </td>
            </tr>
            <tr>
                <td>Country:</td>
                <td th:text="${order.shipCountry}">
<!--                    <c:out value="${sessionScope.order.shipCountry}" />-->
                </td>
            </tr>
            <tr>
                <td>Courier:</td>
                <td th:text="${order.courier}">
<!--                    <c:out value="${sessionScope.order.courier}" />-->
                </td>
            </tr>
            <tr>
                <td colspan="2" >Status:</td>
                  <!--  Status:<c:out value="${sessionScope.order.status}" />-->
               <td th:text="${order.status}" >

               </td>
            </tr>
            <tr>
                <td colspan="2">
                    <table>
                        <tr>
                            <th>Item ID</th>
                            <th>Description</th>
                            <th>Quantity</th>
                            <th>Price</th>
                            <th>Total Cost</th>
                        </tr>
                        <tr th:each="lineItem:${order.lineItems}">
                            <td>
                                <a th:href="@{/catalog/viewItem(itemId=${lineItem.item.itemId})}" th:text="${lineItem.item.itemId}"></a>
                            </td>
                            <td th:if="${lineItem.item} != null" th:text="${lineItem.item.attribute1} + ' ' + ${lineItem.item.product.name}">
                                <i th:if="${lineItem.item} == null">{description unavailable}</i>

                            </td>

                            <td th:text="${lineItem.quantity}">quantity</td>
                            <td>
                                <p3 th:text="'$'+${#numbers.formatDecimal(lineItem.unitPrice,1,2)}">listPrice</p3>
                            </td>
                            <td>
                                <p3 th:text="'$'+${#numbers.formatDecimal(lineItem.total,1,2)}">totalPrice</p3>
                            </td>

                        </tr>



<!--                        <c:forEach var="lineItem" items="${sessionScope.order.lineItems}">-->
<!--                            <tr>-->
<!--                                <td>-->
<!--                                    <a href="viewItem?itemId=${lineItem.item.itemId}">${lineItem.item.itemId}</a>-->
<!--                                </td>-->
<!--                                <td><c:if test="${lineItem.item != null}">-->
<!--                                    ${lineItem.item.attribute1}-->
<!--                                    ${lineItem.item.attribute2}-->
<!--                                    ${lineItem.item.attribute3}-->
<!--                                    ${lineItem.item.attribute4}-->
<!--                                    ${lineItem.item.attribute5}-->
<!--                                    ${lineItem.item.product.name}-->
<!--                                </c:if>-->
<!--                                    <c:if test="${lineItem.item == null}">-->
<!--                                        <i>{description unavailable}</i>-->
<!--                                    </c:if></td>-->

<!--                                <td>${lineItem.quantity}</td>-->
<!--                                <td><fmt:formatNumber value="${lineItem.unitPrice}" pattern="$#,##0.00" /></td>-->
<!--                                <td><fmt:formatNumber value="${lineItem.total}" pattern="$#,##0.00" /></td>-->
<!--                            </tr>-->
<!--                        </c:forEach>-->
                        <tr>
                            <th colspan="5">
                                Total:
                                <p  th:text="'$'+${#numbers.formatDecimal(order.totalPrice,1,2)}"></p>
<!--                                <fmt:formatNumber value="${sessionScope.order.totalPrice}" pattern="$#,##0.00" />-->
                            </th>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>

</div>


<footer th:replace="common/bottom">
</footer>
</div>
</body>
</html>